<template>
    <div class="fanhui">
        <div class="title"><img src="../assets/images/fanhui.png" alt="" @click="fanhui"></div>
        <div class="kehuxinxi">
           <div>客户<span>{{data.cusName}}</span></div>
           <div>商品<span>{{data.prodName}}</span></div>
           <div>数量<span>{{data.prodNum}}</span></div>
           <div>下单人<span>{{data.orderUserName}}</span></div>
           <div>下单时间<span>{{data.orderTime}}</span></div>
        </div>
        <div class="shouhuor">
           <div>收货人<input type="text" v-model="shour"></div>
           <div>联系电话<input type="text" v-model="dianhua"></div>
           <div style="height: 80px;">收货地址<input class="shoudizhi" type="text"  v-model="shouhuodizhi"></div>
           <div>物流单号<input type="text" v-model="wuliu"></div>
        </div>
        <van-button type="primary" size="large" @click="queren">确认收货</van-button>
    </div>
</template>

<script>
import {fahuo,xiangq} from '../requset/api'
export default {
    data () {
        return {
           shour:'',
           dianhua:'',
           shouhuodizhi:'',
           wuliu:'',
           //发货人信息
           data:{},
           //订单号
           serialNoa:''
        }
    },
    created(){ 
        // console.log(this.$route.params.id);
        this.serialNoa=this.$route.params.id
        let serialNo=this.$route.params.id
        xiangq(
          serialNo
        ).then(res=>{
            // console.log(res);
           if(res.errCode==0){
               this.data=res.data
           }
        })

    },
    methods:{
        fanhui(){
            this.$router.back()
        },
        queren(){
            fahuo({
                serialNo:this.serialNoa,
                receiver:this.shour,
                linkPhone:this.dianhua,
                address:this.shouhuodizhi,
                logisticsCode:this.wuliu
            }).then(res=>{
                // console.log(res);
                this.$router.back()
            })
            // console.log(this.shour,this.dianhua,this.shouhuodizhi,this.wuliu);
        }
    }
}
</script>
 
<style lang = "less" scoped>
   .fanhui{
       width: 100%;
       min-height: 100vh;
       background: #f5f5f5;
        .title{
        background: #003399;
        height: 44px;
        line-height: 44px;
        padding-left: 10px;
        img{
            height: 16px;
        }
    }
    .kehuxinxi{
        background: #fff;
        border-bottom:1px solid #e5e5e5 ;
        margin: 10px 0;
        div{
            height: 44px;
            width: 100%;
            line-height: 44px;
            padding-left: 15px;
            padding-right: 15px;
            box-sizing: border-box;
            border-top:1px solid #e5e5e5 ;
            border-right:1px solid #e5e5e5 ;
            border-left:1px solid #e5e5e5 ;
            span{
               float: right;
               color:#999 ;
            }
        }
    }
    .van-button{
        width: 90%;
        background: #003399;
        border: #003399;
        border-radius: 30px;
        margin-left:5%;
    } 
    .shouhuor{
        background: #fff;
        padding: 24px 15px;
        margin-bottom: 35px;
        div{
            height:30px ;
            margin-bottom: 15px;
       input{
            background: #ececec;
            border: none;
            float: right;
            height: 30px;
            line-height: 30px;
            color: #656565;
            width: 70%;
            border-radius: 5px;
        }
        .shoudizhi{
            height: 80px;
        }
    } 
    }
   }
</style>